const path = require('path');
const { merge } = require('webpack-merge');
const common = require('./webpack.common.js');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const webpack = require('webpack');
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
const TerserPlugin = require('terser-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const Dotenv = require('dotenv-webpack');

module.exports = merge(common, {
    mode: 'production',
    devtool: 'source-map',
    // optimization: {
    //     splitChunks: {
    //         chunks: 'all',
    //         cacheGroups: {
    //             vendors: {
    //                 test: /[\\/]node_modules[\\/]/,
    //                 name: 'vendors',
    //                 chunks: 'initial',
    //             },
    //             common: {
    //                 minChunks: 2,
    //                 name: 'common',
    //                 chunks: 'async',
    //                 reuseExistingChunk: true
    //             }
    //         }
    //     },
    //     runtimeChunk: {
    //         name: 'runtime'
    //     }
    // },
    module: {
        rules: [{
            test: /\.(css|s[ac]ss)$/i,
            use: [
                MiniCssExtractPlugin.loader, // 替换 style-loader
                'css-loader',
                {
                    loader: 'postcss-loader',
                    options: {
                        postcssOptions: {
                            config: path.resolve(__dirname, '../postcss.config.js')
                        }
                    }
                },
                'sass-loader'
            ]
        },
        {
            test: /\.less$/i,
            use: [
                MiniCssExtractPlugin.loader, // 替换 style-loader
                'css-loader',
                'less-loader'
            ]
        },],
    },
    plugins: [

        new Dotenv({
            path: path.resolve(__dirname, '../.env.prod') // 新增配置
        }),
        new CleanWebpackPlugin({
            cleanOnceBeforeBuildPatterns: [
                path.join(__dirname, '../dist/**/*'),
                '!**/favicon.ico',
                '!**/.gitkeep'
            ]
        }),
        new MiniCssExtractPlugin({
            filename: 'static/css/[name].[contenthash].css', // 修改 CSS 路径
            chunkFilename: 'static/css/[name].[contenthash].chunk.css'
        }),

        // 在 plugins 数组中添加：
        new HtmlWebpackPlugin({
            template: './public/index.html',
            filename: 'index.html',
            publicPath: './',
            title: process.env.APP_TITLE || '默认标题' // 读取环境变量
        }),
        // new webpack.DefinePlugin({
        //     'process.env': JSON.stringify({
        //         APP_TITLE: process.env.APP_TITLE  // 读取环境变量
        //     })
        // }),
        new BundleAnalyzerPlugin({
            analyzerMode: 'static',
            reportFilename: 'report.html', // 移除上级目录
            openAnalyzer: false, // 新增配置
            generateStatsFile: false // 新增配置
        })
    ],
});
